<template>
       <h2 style="text-align: center;">用户理财赎回明细</h2>
       <table class="table table-bordered table-hover table-striped">
        <thead style="background-color: aqua;">
            <tr>
                <th>理财项目编号</th>
                <th>账户名称</th>
                <th>理财名称</th>
                <th>用户购买金额</th>
                <th>赎回金额</th>
            </tr>
        </thead>
         <tbody>
            <tr v-for="item in info">
                <td>{{item.F_id}}</td>
                <td>{{item.UL_Name}}</td>
                <td>{{item.F_name}}</td>
                <td>{{item.UF_Money}}</td>
                <td>{{item.UFR_Money}}</td>
            </tr>
        </tbody>
       </table>
</template>

<script setup lang="ts">
import {useRoute} from 'vue-router'

const route = useRoute()

alert(route.params.Fid)

import {ref,onMounted} from 'vue'
import axios from 'axios'

const info = ref([  
  {
    F_id:0,
    UL_Name:"",
    F_name:"",
    UF_Money:0,
    UFR_Money:0
  }
])

//生命周期勾子
onMounted(()=>{
    LoadData();
}) 
//完成用户赎回详细信息显示
const LoadData=()=>{
    axios({
       url:"https://localhost:44337/api/Finans/UserFinanRedeemInfo",
       method:"get",
       params:{
          Fid:route.params.Fid
       }
    }).then(res=>{
        console.log(res.data);
        info.value=res.data;
    }).catch(err=>{
        console.log(err);
    })
}
</script>